/**
 * 扩展样式定义
 * 为组件添加自定义样式
 */

@import "./element-variables.scss";

// 对dialog样式进行修改，使其垂直居中显示
.centerDialog{
  &.el-dialog__wrapper {
    display: flex;
    align-items: center;
    & > .el-dialog {
      margin-top: 0 !important;
    }
  }
}
.input-number-left.el-input-number {
  .el-input__inner {
    text-align: left;
  }
}

.desc-poper{
  white-space: pre-wrap;
  word-break: break-word;
}

// tree-select设置
.vue-treeselect{
  width: 100%;
  height: 32px !important;
  line-height: 32px;
  font-size: 14px;
  div{
    line-height: 30px;
  }
  &__control{
    border-color: #EAEAEA !important;
    border-radius: 4px !important;
    height: 30px !important;
  }
  &.vue-treeselect--has-value .vue-treeselect__input{
    display: block;
  }
  .vue-treeselect__menu{

    &::-webkit-scrollbar-track-piece {
      background: #fff;
    }
  
    &::-webkit-scrollbar {
      width: 8px;
      height: 8px;
    }
  
    &::-webkit-scrollbar-thumb {
      background: rgba(144, 147, 153, 0.3);
      border-radius: 20px;
    }
    overflow: scroll;
    width: 100%;
    min-width: 360px;
    .vue-treeselect__option-arrow-placeholder{
      display: inline-block;
    }
    .vue-treeselect__option{
      width: auto;
      table-layout: fixed;
      .vue-treeselect__label-container{
        display: table-cell;
        .vue-treeselect__label{
          overflow: visible;
          text-overflow: unset;
          max-width: unset;
        }
      }
    }
  }
  &.vue-treeselect--disabled {
    .vue-treeselect__control{
      background-color: #F5F7FA;
    }
    .vue-treeselect__single-value{
      color: #a3a3a3;
    }
  }
}